<?
layout("/inc/layout.html",{title:sysTitle}){
?>
<div id="page-wrapper">
      <!--BEGIN TITLE & BREADCRUMB PAGE-->
      <div id="title-breadcrumb-option-demo" class="page-title-breadcrumb">
          <div class="page-header pull-left">
              <div class="page-title">菜单管理</div>
          </div>
          <ol class="breadcrumb page-breadcrumb pull-left">
              <li><i class="fa fa-home"></i>&nbsp;<a href="main.html">首页</a>&nbsp;&nbsp;<i class="fa fa-angle-right"></i>&nbsp;&nbsp;</li>
              <li>系统管理&nbsp;&nbsp;<i class="fa fa-angle-right"></i>&nbsp;&nbsp;</li>
              <li class="active">菜单管理</li>
          </ol>
           
          <div class="clearfix"></div>
      </div>
      <!--END TITLE & BREADCRUMB PAGE-->
      <!--BEGIN CONTENT-->
      <div class="page-content">
        <!-- 知识分类s -->
    
        <!-- 知识分类e -->
      <div class="rowl" >
			<div class="col-lg-4">
	            <div class="panel" style="height: 540px; overflow: auto;">
	                <div class="panel-heading">菜单列表
	                <p style="float: right;">
	                	<button  type="button" onclick="addMenu()" class="btn btn-green btn-square" id="savejiedian">新建</button>&nbsp;
						<button  type="button" onclick="uploadMenu()" class="btn btn-green btn-square" id="savejiedian">编辑</button>&nbsp;
						<button  type="button"   class="btn btn-green btn-square"  onclick="deleteMenu()" >删除</button>
	                </p>
	                </div>
	                <div class="panel-body" >
	                	<ul id="tree" class="ztree" style="width:270px"; overflow:auto;"></ul>
	                </div>
	            </div>
	        </div>
	        <div class="col-lg-6">
	        	<div class="panel" style="height: 540px">
					<div class="panel-heading">菜单信息</div>
					<div class="form-body pal">
					<div style="padding-top: 5%; margin-right: auto; padding-bottom: 65px;">
						<label for="inputUsername" class="col-md-3 control-label">
						  <div align="right">菜单名称
							<span class='require' id="zhongwenName">*</span></div>
	                    </label>
						<div class="col-md-7">
							<div class="input-icon" >
								<input id="name" type="text" class="form-control" disabled="true" />
							</div>
						</div>
					</div>

				<div style="margin-right: auto; padding-bottom: 65px;">
					<label for="inputUsername" class="col-md-3 control-label">
					  <div align="right">菜单描述
						<span class='require' id="yingwenName">*</span></div>
                    </label>
					<div class="col-md-7">
						<div class="input-icon">
							<input id="description" type="text"  class="form-control" disabled="true" />
						</div>
					</div>
				</div>
				<div style="margin-right: auto; padding-bottom: 65px;">
					<label for="inputUsername" class="col-md-3 control-label">
					  <div align="right">URL
						<span class='require' id="bianhao">*</span></div>
                                      </label>
					<div class="col-md-7">
						<div class="input-icon">
							<input id="url" type="text" class="form-control" disabled="true" />
						</div>
					</div>
				</div>
				<div style="margin-right: auto; padding-bottom: 65px;">
					<label for="inputUsername" class="col-md-3 control-label">
					  <div align="right">标头
						<span class='require' id="paixu">*</span></div>
                     </label>
						<div class="col-md-7">
						<div class="input-icon">
							<input id="headline" type="text" class="form-control" disabled="true"/>
						</div>
					</div>
				</div>
				<div style="margin-right: auto; padding-bottom: 65px;">
					<label for="inputUsername" class="col-md-3 control-label">
					  <div align="right">排序
						<span class='require' id="paixu">*</span></div>
                     </label>
						<div class="col-md-7">
						<div class="input-icon">
							<input id="sort" type="text" class="form-control" disabled="true" />
						</div>
					</div>
				</div>
				<div style="margin-right: auto; padding-bottom: 60px;">
					<label for="inputUsername" class="col-md-3 control-label">
					 		<div align="right">状态
								<span class='require' id="paixu">*</span></div>
                    	 </label>
						<div class="col-md-7">
							<div class="input-icon">
								<select id="stauts" class="form-control" disabled="true">
									<option value="0">启用</option>
									<option value="1">禁用</option>
								</select>
							</div>
						</div>
				</div>
						
				<div style="margin-right: auto; padding-bottom: 60px;">
					<label for="inputUsername" class="col-md-3 control-label"><div align="right">父节点
					<span class='require'>*</span></div></label>
					<div class="col-md-7">
						<div class="input-icon">
							<input id="parentclassname" type="text" class="form-control" disabled="true" /> 
							<input id="parentClassid" type="hidden" class="form-control" />
						</div>
					</div>
				</div>
				</div>
				</div>
				</div>
	          <!-- <div class="col-lg-6">
	        	 <div class="panel" style="height: 540px;overflow: auto;">
		             <div class="panel-heading">菜单信息</div>
		               <div id="menuButtion" style="padding-top: 5%;padding-left: 4%">
		               		<span class='subtitle' style="color: #CCC;" >数据为空！请选择菜单列表</span>
		               </div>
		    		</div>
	      		 </div>  -->
	      	</div>
	    <!--END CONTENT-->
	    </div>
	  </div>
<?} ?>
  
<SCRIPT type="text/javascript" >
	var parentname =1;
	var ztreeid;
	function getzTreeid() {
		return ztreeid;
	}
	var ztreename;
	function getztreename() {
		return ztreename;
	}
	var buttionId;
	function getButtionId() {
		return buttionId;
	}
function addMenu() {
		layer.open({
			type : 2,
			area : [ '550px', '550px' ],
			fix : false, //不固定
			scrollbar : false,
			shadeClose : true,
			move : false,
			title : "添加菜单",
			skin : 'layui-layer-rim', //加上边框
			btn : [ '保存 ', '关闭' ],
			content : [ "knowledge-edit-data-addmenu.html", 'no' ],
			yes : function(index, layer) {
				 var iframeWin = parent.window[layer.find('iframe')[0]['name']];
				iframeWin.save();
			},
			cancel : function(index) {
			}
		});
	};
	//树状结构
	$(function() {
		initTree();
	});
	function get() {
		initTree();
	}

	function initTree() {
		$.ajax({
			type : "post",
			url : "knowledgeEditDataQueryMent.do",
			dataType : "json",
			beforeSend : function(XMLHttpRequest) {
			},
			success : drawTree,
		});
	}

	function drawTree(data) {
		var setting = {
			view : {
				dblClickExpand : false,
			},
			data : {
				simpleData : {
					enable : true,
				}
			},
			check : {
				enable : false
			},
			callback : {
				onClick : onClick
			},
		};
		var zNodes = eval(data);
		
		$.fn.zTree.init($("#tree"), setting, zNodes);
		zTree = $.fn.zTree.getZTreeObj("tree").expandAll(true);
		zTree.expandNode(zTree.getNodes()[0], true);//指定某节点折叠

	}
	function onClick(e, treeId, treeNode) {
		ztreeid = treeNode.id;
		ztreename=treeNode.name
		//queryMenuButton();
		queryUpload(ztreeid);
		 if(treeNode.children==null){
       		parentname=0;
       	 }else{
         	parentname=1;
        }
	}
	
	//删除
	function deleteMenu() {
	if(ztreeid ==null){
			layer.msg('请选择要删除菜单！');
		}else{
		if (parentname == 0) {
			if (confirm("是否确认删除！！")){
				$.ajax({
					type : "post",
					url : "knowledgeEditDataDeleteMent.do",
					data : {
						"id" : ztreeid
					},
					dataType : "json",
					beforeSend : function(XMLHttpRequest) {
					},
					success : function(data){
						ztreename="根目录";
						ztreeid=0;
						initTree();
						layer.msg('删除成功！');
					},
				});
			}
		}else {
			alert("有子分类不允许删除");
		}
		}
	}
	//编辑
	function uploadMenu() {
	if(ztreeid ==null){
			layer.msg('请选择要编辑菜单！');
		}else{
			layer.open({
				type : 2,
				area : [ '550px', '550px' ],
				fix : false, //不固定
				scrollbar : false,
				shadeClose : true,
				move : false,
				title : "编辑菜单",
				skin : 'layui-layer-rim', //加上边框
				btn : [ '保存 ', '关闭' ],
				content : [ "knowledge-edit-data-uploadmenu.html", 'no' ],
				yes : function(index, layer) {
					 var iframeWin = parent.window[layer.find('iframe')[0]['name']];
					iframeWin.save();
				},
				cancel : function(index) {
				}
			});
		}
	};
	//查询按钮
	function queryMenuButton(){
		$.ajax({
			type : "post",
			url : "knowledgeEditDataQueryMentButton.do",
			dataType : "json",
			data :{
				"id" : ztreeid
			},
			beforeSend : function(XMLHttpRequest) {
			},
			success : function(data){
				//alert(JSON.stringify(data));
				var str = "";
				$("#menuButtion").html("");
				for ( var i = 0; i < data.length; i++) {
					str += "<input class='btn btn-blue btn-square' style='padding-top: -10px;margin-top: 10px;margin-right: 0px;' onclick='querybutton("+data[i].id+")' type='button' value="+data[i].name+" />"
						+ "<a  href='javascript:deleteMenuButton("
						+ data[i].id
						+ ");' style='font-size: 18px; margin-right: 5px;'><i"
						+"style='margin-left: -30px;' class='fa fa-times-circle-o'></i></a>";
				}
					str += "<input style='margin-top: 10px;' class='btn btn-blue btn-square' onclick='addMenuButton()' type='button' value='+' />";
				$("#menuButtion").append(str);
			},
		});
	}
	function queryUpload(qIds){
		 $.ajax({
			type : "post",
			data : {
				"id":qIds
			},
			url : "knowledgeEditDataEditMent.do",
			dataType : "json",
			beforeSend : function(XMLHttpRequest) {
			},
			success : function(data){
				 $("#name").val(data[0].name);
				 $("#url").val(data[0].url);
           		 $("#description").val(data[0].description);
           		 $("#level").val(data[0].level);
           		 $("#parentClassid").val(data[0].parentId); 
           		 $("#parentclassname").val(data[0].parentName); 
           		 $("#stauts").val(data[0].status); 
           		 $("#headline").val(data[0].headline); 
           		 $("#sort").val(data[0].sort); 
			},
		});
	}
	//删除按钮
	function deleteMenuButton(deleteMenuId) {
	if (confirm("是否确认删除！！")){
		$.ajax({
			type : "post",
			data : {
				"id" : deleteMenuId,
				"menuId" : ztreeid
			},
			url : "knowledgeEditDataDeleteMenuButton.do",
			dataType : "json",
			traditional : true,
			beforeSend : function(XMLHttpRequest) {},
			success : function(data){
				queryMenuButton();
				layer.msg('删除成功！');
			},
		});
	}
	}
	
	//添加按键
	function addMenuButton(){
		layer.open({
			type : 2,
			area : [ '600px', '500px' ],
			fix : false, //不固定
			scrollbar : false,
			shadeClose : true,
			move : false,
			title : "添加按键",
			skin : 'layui-layer-rim', //加上边框
			btn : [ '保存 ', '关闭' ],
			content : [ "knowledge-edit-data-addmenubutton.html", 'no' ],
			yes : function(index, layer) {
				 var iframeWin = parent.window[layer.find('iframe')[0]['name']];
				iframeWin.save();
			},
			cancel : function(index) {
			}
		});
	
	}
	
	//按钮详情
	function querybutton(buttonid){
		buttionId=buttonid;
		layer.open({
			type : 2,
			area : [ '500px', '500px' ],
			fix : false, //不固定
			scrollbar : false,
			shadeClose : true,
			move : false,
			title : "按键详情",
			skin : 'layui-layer-rim', //加上边框
			btn : [ '保存 ', '关闭' ],
			content : [ "knowledge-edit-data-querymenubutton.html", 'no' ],
			yes : function(index, layer) {
				 var iframeWin = parent.window[layer.find('iframe')[0]['name']];
				iframeWin.save();
			},
			cancel : function(index) {
			}
		});
	}

</SCRIPT>    